

<html>
		<head>
		<title></title>
		<link rel="stylesheet" href="style.css">
	<script src="jquery-1.11.0.js"></script>
		<script src="gen.js"></script>	
		<script>
			
			//makes a synchronous call to the page u and return the 
			//result as object
			
			function syncAjax(u){
				var obj=$.ajax(
					{url:u,
					 async:false
					 }
				);
				return $.parseJSON(obj.responseText);
				
			}
			
			function edit(obj,id){
				var r=get_community_members(id);
				if(r.result==0){
					//show error message
					return;
				}
				//get the data from object r and put it in the form
				/*
				$("#vaccine_name").prop("value", "something");
				$("#schedule").prop("value", "something");
				$("#vaccine_url").prop("value", "something");
				*/
				$("#community_member_id").prop("value", r.community.community_member_id);
				$("#card_number").prop("value", r.community.card_number);
				$("#fullname").prop("value", r.community.fullname);
				$("#age").prop("value", r.community.age);
				$("#birthdate").prop("value", r.community.birthdate);
				$("#gender").prop("value", r.community.gender);
				$("#household_id").prop("value", r.community.household_id);
				$("#community_id").prop("value", r.community.community_id);
				$("#registration_date").prop("value", r.community.registration_date);
				$("#up_datedate").prop("value", r.community.up_datedate);
				$("#device_id").prop("value", r.community.device_id);
				
				//show the form
				//find where the user clicked and store it in x and y
				var y=event.clientY;
				var x=event.clientX/2;
				//use x and y to set the location of the form
				$("#divEdit").css("top",y);
				$("#divEdit").css("left",x);
				//display the form 
				$("#divEdit").fadeIn(1000);
			}

            function add(obj)
            {

                $("#community_member_id").prop("value", "");
                $("#card_number").prop("value", "");
                $("#fullname").prop("value", "");
                $("#age").prop("value", "");
                $("#birthdate").prop("value","");
                $("#gender").prop("value", "");
                $("#household_id").prop("value", "");
                $("#community_id").prop("value", "");
                $("#registration_date").prop("value", "");
                $("#device_id").prop("value", "");

                //show the form
                //find where the user clicked and store it in x and y
                var y=event.clientY;
                var x=event.clientX/2;
                //use x and y to set the location of the form
                $("#divAdd").css("top",y);
                $("#divAdd").css("left",x);
                //display the form
                $("#divAdd").fadeIn(500);
            }

			//returns a result object for one vaccine 
			function get_community_members(id){
				var u="community_members_action.php?cmd=1&id="+id;
				
				return syncAjax(u);
			}
			//makes asynchronous call to the save page
			
			function save()
            {
				//complete the url
				var cmid = document.getElementById("community_member_id").value;
				var cn = document.getElementById("card_number").value;
				var fn = document.getElementById("fullname").value;
				var a = document.getElementById("age").value;
				var bd = document.getElementById("birthdate").value;
				var g = document.getElementById("gender").value;
				var hi = document.getElementById("household_id").value;
				var ci = document.getElementById("community_id").value;
				var rd = document.getElementById("registration_date").value;
				var ud = document.getElementById("up_datedate").value;
				var di = document.getElementById("device_id").value;
				//var id =5;
				var u="community_members_action.php?cmd=2&cmid="+cmid
				                  +"&cn="+cn
								  +"&fn="+fn
								  +"&a="+a
								  +"&bd="+bd
								  +"&g="+g
								  +"&hi="+hi
								  +"&ci="+ci
								  +"&rd="+rd
								  +"&ud="+ud
								  +"$di="+di;
						//alert(u);
								  
					$("#divEdit").css("background-color","006600");
				$("#divEdit").fadeOut(500); // hides any html object
				    //alert("saved");
					location.reload();
					
					return syncAjax(u);
				
				
				//cancel();
			}

            function save_add()
            {
                //complete the url
                var cd=$("#m_card_number").val();
                var fn=$("#m_fullname").val();
                var ag=$("#m_age").val();
                var bdate=$("#m_birthdate").val();
                var gd=$("#m_gender").val();
                var hs=$("#m_household").val();
                var cid=$("#m_community").val();
                var reg=$("#m_registration_date").val();
                var dv=$("#m_device_id").val();
                var u="community_members_action.php?cmd=4&cd="+cd+"&fn="+fn+"&ag="
                    +ag+"&bdate="+bdate+"&gd="+gd+"&hs"+hs+"&cid="+cid+"&reg="
                    +reg+"&dv="+dv;
                //alert(u);
                //var r = syncAjax(u);

                $.getJSON(u,saveDone);
                //reload
                window.location.reload();
                cancel_add();
            }

            function delete_com(obj,id) {
                var r=get_community_members(id);
               // alert(r);
                if(r.result==0){
                    //show error message
                    return;
                }

                //get the data from the object r and put it in the form
                $("#community_member_id").prop("value", r.community.community_member_id);
                $("#card_num").prop("value", r.community.card_number);
                $("#fullnm").prop("value", r.community.fullname);
                //show the form
                //find where the user clicked and store it in x and y
                var y=event.clientY;
                var x=event.clientX/2;
                //use x and y to set the location of the form
                $("#divDelete").css("top",y);
                $("#divDelete").css("left",x);
                //display the form
                $("#divDelete").fadeIn(300);
            }

            function delete_cmm(){
                //complete the url
                var cmid = document.getElementById("community_member_id").value;

                var u="community_members_action.php?cmd=5&cmid="+cmid;
                alert(u);
                $("#divDelete").css("background-color","006600");
                $("#divDelete").fadeOut(500); // hides any html object
                alert("Deleted");
                location.reload();

                return syncAjax(u);

            }

			function saveDone(data){
				
				alert(data);
			}
			//hides the form
			function cancel_add(){
				//fade out the form in half a second
				$("#divAdd").fadeOut(500); // hides any html object
			}
            function cancel()
            {
                //fade out the form in half a second
                $("#divEdit").css("background-color","006600");
                $("#divEdit").fadeOut(500); // hides any html object
            }
            function cancel_cm(){
                //fade out the form in half a second
                $("#divDelete").css("background-color","006600");
                $("#divDelete").fadeOut(500); // hides any html object
            }
		</script>		
	</head>
	<body>
		<table>
			<tr>
				<td colspan="2" id="pageheader">
					<h3>Health Information System</h3>
				</td>
			</tr>
			<tr>
				<td id="mainnav">
					<div class="menuitem">location</div>
					<div class="menuitem">opd cases</div>
					<div class="menuitem">health promotion</div>
					<div class="menuitem">nutrition</div>
					<div class="menuitem">child welfare</div>
					<div class="menuitem">family planning</div>
				</td>
				<td id="content">
					<div id="divPageMenu">
						<span class="menuitem">Sub districts</span> |
						<span class="menuitem">Communities</span> |
						<span class="menuitem">View map</span> |
						<input type="text" id="txtSearch">
						<span class="menuitem">search</span> |
                    </div>
                    <div id="divPageMenu">
                        <span class="menuitem"><a href="school_view.php" >Schools Visits</a></span> |
                        <span class="menuitem"><a href="household_view.php">Households Visits</a></span> |
                        <span class="menuitem"><a href="community_members_view.php">Community Members</a></span> |
                        <span class="menuitem"><a href="community_list.php">Communities</a></span> |
                        <span class="menuitem"><a href="service_view.php">Family Planning Service</a></span>
                    </div>
						<div id="divStatus" class="status">
						status message
					</div>
					<div id="divContent">
                        <b><p align = "center">COMMUNITIY MEMBERS</p></b>
                        <span class='hotspot' onclick='add(this)'>Add Member</span>
						<table class="reportTable" width="100%" >
							<tr class="header" >
								<td>ID</td>
                                <td>Card Number</td>
								<td>Community Member</td>
								<td></td>
                                <td></td>
							</tr>
					<div id="divStatus" class="status">
						
					</div>
					<div id="divContent">
		<?php
			// including the schools class for method calls
			include_once("community_members.php");

			//call methods here to test
			$obj =  new community_members();
			if (!$obj->get_all_community_members())
			{
				echo "error";
				exit();
			}
					$memberName = "";
		if (isset($_REQUEST["fullname"]))
		{
			$memberName = $_REQUEST['fullname'];
			$obj -> search_community_members($memberName);

		}
	$row=$obj->fetch();
	$row_counter=0;
	while($row){
		
		if($row_counter%2==0){
			$style=" class='row1' ";
		}else{
			$style=" class='row2'  ";
		}	
		$id=$row['community_member_id'];
		echo "<tr $style >";
			echo "<td>$id</td>";
			echo "<td>$row[card_number]</td>";
            echo "<td>$row[fullname]</td>";
			echo "<td><span class='hotspot' onclick='edit(this,$id)'>edit<span></td>";
            echo "<td><span class='hotspot' onclick='delete_com(this,$id)'>delete<span></td>";
		echo "</tr>";
		$row=$obj->fetch();
		$row_counter++;
	}
	
?>
		               </table>
					</div>
				</td>
			</tr>
		</table>
		

	<div id="divEdit" class = "popupForm">
		<table class="tableForm" >
		
		<tr>
			    <td class="label">Card No</td>
				<td class="field"><input type="text" value="<?php echo $row['card_number'] ?>" id="card_number" ></td>
			</tr>
			<tr>
				<td class="label">Fullname</td>
				<td class="field"><input type="text" value="" id="fullname" >
				</td>
			</tr>
			<tr>
				<td class="label">Age</td>
				<td class="field"><input type="text" value="" id="age" >
				</td>
			</tr>	
			<tr>
				<td class="label">Birth Date</td>
				<td class="field"><input type="text" value="" id="birthdate" >
				</td>
		    </tr>
			<tr>
				<td class="label">Gender</td>
				<td class="field"><input type="text" value="" id="gender" >
				</td>
			</tr>
			<tr>
				<td class="label">Household_id</td>
				<td class="field"><input type="text" value="" id="household_id" >
				</td>
			</tr>
			<tr>
				<td class="label">Community_id</td>
				<td class="field"><input type="text" value="" id="community_id" >
			    </td>
			</tr>
			<tr>
				<td class="label">Reg Date</td>
				<td class="field"><input type="text" value="" id="registration_date" >
				</td>
			</tr>
			<tr>
				<td class="label">Update Date:</td>
				<td class="field"><input type="text" value="" id="up_datedate" >
				</td>
			</tr>
			<tr>
				<td class="label">Device_id:</td>
				<td class="field"><input type="text" value="" id="device_id" >
				</td>
			</tr>
			
			<tr><td class="label"></td>
						<td class="field">
							<input type="button" value="save" onclick="save()" >
							<input type="button" value="cancel" onclick="cancel()" >
			</td>
			</tr>
			<input type="hidden" value="<?php echo $row['community_member_id'] ?>" id ="community_member_id" >
		
			</table>
	        </div>

        <div id="divAdd" class = "popupForm">
            <table class="tableForm" >

                <tr>
                    <td class="label">Card No:</td>
                    <td class="field"><input type="text" value="" id="m_card_number" ></td>
                </tr>
                <tr>
                    <td class="label">Fullname:</td>
                    <td class="field"><input type="text" value="" id="m_fullname" >
                    </td>
                </tr>
                <tr>
                    <td class="label">Age:</td>
                    <td class="field"><input type="text" value="" id="m_age" >
                    </td>
                </tr>
                <tr>
                    <td class="label">Birthdate:</td>
                    <td class="field"><input type="text" value="" id="m_birthdate" >
                    </td>
                </tr>
                <tr>
                    <td class="label">Gender</td>
                    <td class="field"><input type="text" value="" id="m_gender" >
                    </td>
                </tr>
                <tr>
                    <td class="label">Household_id</td>
                    <td class="field"><input type="text" value="" id="m_household_id" >
                    </td>
                </tr>
                <tr>
                    <td class="label">Community_id:</td>
                    <td class="field"><input type="text" value="" id="m_community_id" >
                    </td>
                </tr>
                <tr>
                    <td class="label">Reg Date:</td>
                    <td class="field"><input type="text" value="" id="m_registration_date" >
                    </td>
                </tr>

                <tr>
                    <td class="label">Device_id:</td>
                    <td class="field"><input type="text" value="" id="m_device_id" >
                    </td>
                </tr>

                <tr><td class="label"></td>
                    <td class="field">
                        <input type="button" value="save" onclick="save_add()" >
                        <input type="button" value="cancel" onclick="cancel_add()" >
                    </td>
                </tr>
            </table>
        </div>
        <div id="divDelete" class = "popupForm">

            <table class="tableForm" >
                <tr>
                    <div class="label">Are you sure you want to delete?</div>
                    <td class="label">card_number:</td>
                    <td class="field"><input type="text" value="<?php echo $row['card_number'] ?>" id="card_num" ></td>
                </tr>
                <tr>
                    <td class="label">fullname:</td>
                    <td class="field"><input type="text" value="" id="fullnm" >
                    </td>
                </tr>
                <tr><td class="label"></td>
                    <td class="field">
                        <input type="button" value="Yes" onclick="delete_cmm()" >
                        <input type="button" value="No" onclick="cancel_cm()" >
                    </td>
                </tr>
                <input type="hidden" value="<?php echo $row['community_member_id'] ?>" id ="community_member_id" >

            </table>

        </div>
	</body>
</html>
